<template><div><h2 id="小部件-widgets" tabindex="-1"><a class="header-anchor" href="#小部件-widgets"><span>小部件（Widgets）</span></a></h2>
<p>小部件是在 <a href="https://learnku.com/docs/yii-framework/2.0.x//views/12005" target="_blank" rel="noopener noreferrer">视图</a> 中使用的可重用单元，使用面向对象方式创建复杂和可配置用户界面单元。例如，日期选择器小部件可生成一个精致的允许用户选择日期的日期选择器， 你只需要在视图中插入如下代码：</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>jui<span class="token punctuation">\</span>DatePicker</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token delimiter important">?></span></span></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token class-name static-context">DatePicker</span><span class="token operator">::</span><span class="token function">widget</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'name'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'date'</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>Yii 提供许多优秀的小部件，比如 <code v-pre>yii\widgets\ActiveForm</code>，<code v-pre>yii\widgets\Menu</code>，jQuery UI widgets，Twitter Bootstrap widgets 等。接下来介绍小部件的基本知识，如果你想了解某个小部件请参考对应的类 API 文档。</p>
<h2 id="使用小部件" tabindex="-1"><a class="header-anchor" href="#使用小部件"><span>使用小部件</span></a></h2>
<p>小部件基本上在视图中使用，可调用 [[yii\base\Widget::widget()]] 方法使用小部件。该方法使用 <a href="https://github.com/yiisoft/yii2/blob/master/docs/guide-zh-CN/concept-configurations.md" target="_blank" rel="noopener noreferrer">配置</a> 数组初始化小部件并返回小部件渲染后的结果。例如，如下代码插入一个日期选择器小部件，它配置为使用中文，输入框内容为 <code v-pre>$model</code> 的 <code v-pre>from_date</code> 属性值。</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>jui<span class="token punctuation">\</span>DatePicker</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token delimiter important">?></span></span></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token class-name static-context">DatePicker</span><span class="token operator">::</span><span class="token function">widget</span><span class="token punctuation">(</span><span class="token punctuation">[</span></span>
<span class="line">    <span class="token string single-quoted-string">'model'</span> <span class="token operator">=></span> <span class="token variable">$model</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token string single-quoted-string">'attribute'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'from_date'</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token string single-quoted-string">'language'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'zh-CN'</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token string single-quoted-string">'dateFormat'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'php:Y-m-d'</span><span class="token punctuation">,</span></span>
<span class="line"><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>一些小部件可在 <code v-pre>yii\base\Widget::begin()</code> 和 <code v-pre>yii\base\Widget::end()</code> 调用中使用数据内容。例如如下代码使用 <code v-pre>yii\widgets\ActiveForm</code> 小部件生成一个登录表单，小部件会在 <code v-pre>begin()</code> 和 <code v-pre>end()</code> 执行处分别生成 <code v-pre>&lt;form&gt;</code> 的开始标签和结束标签，中间的任何代码也会被渲染。</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>widgets<span class="token punctuation">\</span>ActiveForm</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>helpers<span class="token punctuation">\</span>Html</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span> <span class="token variable">$form</span> <span class="token operator">=</span> <span class="token class-name static-context">ActiveForm</span><span class="token operator">::</span><span class="token function">begin</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'id'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'login-form'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line">    <span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token variable">$form</span><span class="token operator">-></span><span class="token function">field</span><span class="token punctuation">(</span><span class="token variable">$model</span><span class="token punctuation">,</span> <span class="token string single-quoted-string">'username'</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line">    <span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token variable">$form</span><span class="token operator">-></span><span class="token function">field</span><span class="token punctuation">(</span><span class="token variable">$model</span><span class="token punctuation">,</span> <span class="token string single-quoted-string">'password'</span><span class="token punctuation">)</span><span class="token operator">-></span><span class="token function">passwordInput</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>form-group<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line">        <span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token class-name static-context">Html</span><span class="token operator">::</span><span class="token function">submitButton</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'Login'</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span> <span class="token class-name static-context">ActiveForm</span><span class="token operator">::</span><span class="token function">end</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>注意和调用 [[yii\base\Widget::widget()]] 返回渲染结果不同，调用 [[yii\base\Widget::begin()]] 方法返回一个可组建小部件内容的小部件实例。</p>
<blockquote>
<p>Note: 当调用 [[yii\base\Widget::end()]] 的时候，一些小部件将使用 <a href="https://www.php.net/manual/zh/book.outcontrol.php" target="_blank" rel="noopener noreferrer">输出缓冲控制</a> 来调整封闭的内容。因此，当调用 [[yii\base\Widget::begin()]] 和 [[yii\base\Widget::end()]] 时，最好在同一个视图文件里。不遵循这个规则可能会导致意外的输出。</p>
</blockquote>
<h3 id="配置全局默认值" tabindex="-1"><a class="header-anchor" href="#配置全局默认值"><span>配置全局默认值</span></a></h3>
<p>小部件的全局默认值可以通过 DI 容器配置：</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token class-name class-name-fully-qualified static-context"><span class="token punctuation">\</span>Yii</span><span class="token operator">::</span><span class="token variable">$container</span><span class="token operator">-></span><span class="token function">set</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'yii\widgets\LinkPager'</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token string single-quoted-string">'maxButtonCount'</span> <span class="token operator">=></span> <span class="token number">5</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div></div></div><p>有关详细信息，请参阅 <a href="https://github.com/yiisoft/yii2/blob/master/docs/guide-zh-CN/concept-di-container.md#practical-usage" target="_blank" rel="noopener noreferrer">依赖注入容器“实践中的应用”一节</a> 。</p>
<h2 id="自定义小部件" tabindex="-1"><a class="header-anchor" href="#自定义小部件"><span>自定义小部件</span></a></h2>
<p>可以根据需要以两种不同方式创建小部件。</p>
<h3 id="使用-widget-方法" tabindex="-1"><a class="header-anchor" href="#使用-widget-方法"><span>使用 <code v-pre>widget()</code> 方法</span></a></h3>
<p>继承 <code v-pre>yii\base\Widget</code> 类并覆盖 [[yii\base\Widget::init()]] 和 [[yii\base\Widget::run()]] 方法可创建小部件。通常 <code v-pre>init()</code> 方法处理小部件属性，<code v-pre>run()</code> 方法包含小部件生成渲染结果的代码。渲染结果可以直接“输出”或通过 <code v-pre>run()</code> 方法作为字符串返回。</p>
<p>如下代码中 <code v-pre>HelloWidget</code> 编码并显示赋给 <code v-pre>message</code> 属性的值，如果属性没有被赋值，默认会显示 “Hello World”。</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token keyword">namespace</span> <span class="token package">app<span class="token punctuation">\</span>components</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>base<span class="token punctuation">\</span>Widget</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>helpers<span class="token punctuation">\</span>Html</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"><span class="token keyword">class</span> <span class="token class-name-definition class-name">HelloWidget</span> <span class="token keyword">extends</span> <span class="token class-name">Widget</span></span>
<span class="line"><span class="token punctuation">{</span></span>
<span class="line">    <span class="token keyword">public</span> <span class="token variable">$message</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line">    <span class="token keyword">public</span> <span class="token keyword">function</span> <span class="token function-definition function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line">    <span class="token punctuation">{</span></span>
<span class="line">        <span class="token keyword static-context">parent</span><span class="token operator">::</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$this</span><span class="token operator">-></span><span class="token property">message</span> <span class="token operator">===</span> <span class="token constant">null</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token variable">$this</span><span class="token operator">-></span><span class="token property">message</span> <span class="token operator">=</span> <span class="token string single-quoted-string">'Hello World'</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token punctuation">}</span></span>
<span class="line">    <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line">    <span class="token keyword">public</span> <span class="token keyword">function</span> <span class="token function-definition function">run</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line">    <span class="token punctuation">{</span></span>
<span class="line">        <span class="token keyword">return</span> <span class="token class-name static-context">Html</span><span class="token operator">::</span><span class="token function">encode</span><span class="token punctuation">(</span><span class="token variable">$this</span><span class="token operator">-></span><span class="token property">message</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span></span>
<span class="line"><span class="token punctuation">}</span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>使用这个小部件只需在视图中简单使用如下代码:</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">app<span class="token punctuation">\</span>components<span class="token punctuation">\</span>HelloWidget</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token delimiter important">?></span></span></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?=</span> <span class="token class-name static-context">HelloWidget</span><span class="token operator">::</span><span class="token function">widget</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'message'</span> <span class="token operator">=></span> <span class="token string single-quoted-string">'Good morning'</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>有时小部件需要渲染很多内容，虽然你可以在 <code v-pre>run()</code> 方法中嵌入内容，但更好的方法是将内容放入一个<a href="https://github.com/yiisoft/yii2/blob/master/docs/guide-zh-CN/structure-views.md" target="_blank" rel="noopener noreferrer">视图</a>文件， 然后调用 [[yii\base\Widget::render()]] 方法渲染该视图文件， 例如：</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token keyword">public</span> <span class="token keyword">function</span> <span class="token function-definition function">run</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line"><span class="token punctuation">{</span></span>
<span class="line">    <span class="token keyword">return</span> <span class="token variable">$this</span><span class="token operator">-></span><span class="token function">render</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'hello'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token punctuation">}</span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="使用-begin-和-end-方法" tabindex="-1"><a class="header-anchor" href="#使用-begin-和-end-方法"><span>使用 <code v-pre>begin()</code> 和 <code v-pre>end()</code> 方法</span></a></h3>
<p>这类似于上面的有细微差别。 以下是另一种可在 <code v-pre>begin()</code> 和 <code v-pre>end()</code> 调用中使用的 <code v-pre>HelloWidget</code>， HTML 编码内容然后显示。</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token keyword">namespace</span> <span class="token package">app<span class="token punctuation">\</span>components</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>base<span class="token punctuation">\</span>Widget</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">yii<span class="token punctuation">\</span>helpers<span class="token punctuation">\</span>Html</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line"><span class="token keyword">class</span> <span class="token class-name-definition class-name">HelloWidget</span> <span class="token keyword">extends</span> <span class="token class-name">Widget</span></span>
<span class="line"><span class="token punctuation">{</span></span>
<span class="line">    <span class="token keyword">public</span> <span class="token keyword">function</span> <span class="token function-definition function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line">    <span class="token punctuation">{</span></span>
<span class="line">        <span class="token keyword static-context">parent</span><span class="token operator">::</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token function">ob_start</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line">    <span class="token keyword">public</span> <span class="token keyword">function</span> <span class="token function-definition function">run</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line">    <span class="token punctuation">{</span></span>
<span class="line">        <span class="token variable">$content</span> <span class="token operator">=</span> <span class="token function">ob_get_clean</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token keyword">return</span> <span class="token class-name static-context">Html</span><span class="token operator">::</span><span class="token function">encode</span><span class="token punctuation">(</span><span class="token variable">$content</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span></span>
<span class="line"><span class="token punctuation">}</span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>如上所示，PHP 输出缓冲在 <code v-pre>init()</code> 启动，所有在 <code v-pre>init()</code> 和 <code v-pre>run()</code> 方法之间的输出内容都会被获取，并在 <code v-pre>run()</code> 处理和返回。</p>
<blockquote>
<p>Info: 当你调用 [[yii\base\Widget::begin()]] 时会创建一个新的小部件 实例并在构造结束时调用 <code v-pre>init()</code> 方法， 在 <code v-pre>end()</code> 时会调用 <code v-pre>run()</code> 方法并输出返回结果。</p>
</blockquote>
<p>如下代码显示如何使用这种 <code v-pre>HelloWidget</code>：</p>
<div class="language-php line-numbers-mode" data-highlighter="prismjs" data-ext="php" data-title="php"><pre v-pre class="language-php"><code><span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span></span>
<span class="line"><span class="token keyword">use</span> <span class="token package">app<span class="token punctuation">\</span>components<span class="token punctuation">\</span>HelloWidget</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token delimiter important">?></span></span></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span> <span class="token class-name static-context">HelloWidget</span><span class="token operator">::</span><span class="token function">begin</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line">    sample content that may contain one or more <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>strong</span><span class="token punctuation">></span></span>HTML<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>strong</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>pre</span><span class="token punctuation">></span></span>tags<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>pre</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line">    If this content grows too big, use sub views</span>
<span class="line"></span>
<span class="line">    For e.g.</span>
<span class="line"></span>
<span class="line">    <span class="token php language-php"><span class="token delimiter important">&lt;?php</span> <span class="token keyword">echo</span> <span class="token variable">$this</span><span class="token operator">-></span><span class="token function">render</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'viewfile'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Note: here render() method is of class \yii\base\View as this part of code is within view file and not in Widget class file </span><span class="token delimiter important">?></span></span></span>
<span class="line"></span>
<span class="line"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span> <span class="token class-name static-context">HelloWidget</span><span class="token operator">::</span><span class="token function">end</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span></span>
<span class="line"></span></code></pre>
<div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>默认情况下，小部件的视图应存储在 <code v-pre>WidgetPath/views</code> 目录，<code v-pre>WidgetPath</code> 代表小部件类文件所在的目录。 假如小部件类文件在 <code v-pre>@app/components</code> 下， 上述示例会渲染 <code v-pre>@app/components/views/hello.php</code> 视图文件。 您可以覆盖 [[yii\base\Widget::getViewPath()]] 方法自定义视图文件所在路径。</p>
<h2 id="最佳实践" tabindex="-1"><a class="header-anchor" href="#最佳实践"><span>最佳实践</span></a></h2>
<p>小部件是面向对象方式来重用视图代码。</p>
<p>创建小部件时仍需要遵循MVC模式，通常逻辑代码在小部件类，展示内容在视图中。</p>
<p>小部件设计时应是独立的，也就是说使用一个小部件时候，可以直接丢弃它而不需要额外的处理。但是当小部件需要外部资源如 CSS，JavaScript，图片等会比较棘手，幸运的时候Yii提供 资源包 来解决这个问题。</p>
<p>当一个小部件只包含视图代码，它和视图很相似，实际上，在这种情况下，唯一的区别是小部件是可以重用类，视图只是应用中使用的普通 PHP 脚本。</p>
<blockquote>
<p>💖喜欢本文档的，欢迎点赞、收藏、留言或转发，谢谢支持！<br>
作者邮箱：zhuzixian520@126.com，github地址：<a href="https://github.com/zhuzixian520" target="_blank" rel="noopener noreferrer">github.com/zhuzixian520</a></p>
</blockquote>
</div></template>


